const bgUrl =
	// 'https://edu-yjzk.oss-cn-hangzhou.aliyuncs.com/education/common/2024/07/16/png/calling-card_20240716155512A292.png'
	'https://edu-yjzk.oss-cn-hangzhou.aliyuncs.com/education/common/2024/07/17/png/calling-card-bg_20240717085006A352.png'

const bottomUrl =
	'https://edu-yjzk.oss-cn-hangzhou.aliyuncs.com/education/common/2024/08/22/png/card-bottom_20240822101720A004.png'

function covertImage(url) {
	return new Promise((resolve, reject) => {
		uni.downloadFile({
			url: url,
			success: (res) => {
				resolve(res.tempFilePath)
			},
			fail: (err) => {
				reject(err)
			}
		})
	})
}

export async function drawPersonCard(ctx, info) {
	//清空画布
	ctx.clearRect(0, 0, 452, 362);
	// 设置背景颜色
	ctx.setFillStyle('#1D7DF6');
	ctx.fillRect(0, 0, 452, 362);
	// 圆角
	// ctx.beginPath();
	// ctx.moveTo(0, 0);
	// ctx.arc(452, 0, 0, 0, 2 * Math.PI);
	// ctx.setFillStyle('#1D7DF6');
	// ctx.fill();
	
	//背景图片
	const bg = await covertImage(info.bgImage);
	ctx.drawImage(bg, 20, 26, 412, 310);
	
	//底部图片
	const bottom = await covertImage(bottomUrl);
	ctx.drawImage(bottom, 0, 238, 452, 124);
	const left = 40
	const color = info.color || '#ffffff'
	
	//头像的白色边框
	ctx.arc(368, 90, 44, 0, 2 * Math.PI);
	ctx.setFillStyle('#ffffff');
	ctx.fill();
	//头像
	ctx.save()
	ctx.beginPath()
	ctx.arc(368, 90, 40, 0, 2 * Math.PI)
	ctx.clip()
	const avatar = await covertImage(info.avatar);
	ctx.drawImage(avatar, 330, 52, 80, 80)
	ctx.restore()
	//姓名
	ctx.setFillStyle(color); 
	ctx.setFontSize(28);
	ctx.fillText(info.name, left, 72); 
	//公司
	ctx.setFillStyle(color);
	ctx.setFontSize(14); 
	ctx.fillText(info.company, left, 100);
	
	//职位
	ctx.setFillStyle(color);
	ctx.setFontSize(14); 
	ctx.fillText(info.job, left, 120);
	
	ctx.drawImage('/static/icon/phone.png', left, 146, 20, 20);
	ctx.setFillStyle(color); // 文字颜色
	ctx.setFontSize(14); // 文字字号
	ctx.fillText(info.phone, 70, 162); // 绘制文字
	
	ctx.drawImage('/static/icon/email.png', left, 180, 20, 20);
	ctx.setFillStyle(color);
	ctx.setFontSize(14);
	ctx.fillText(info.email, 70, 196);
	
	ctx.drawImage('/static/icon/address.png', left, 214, 20, 20);
	ctx.setFillStyle(color); // 文字颜色
	ctx.setFontSize(14); // 文字字号
	ctx.fillText(info.address, 70, 230); // 绘制文字
	//绘制虚线
	// ctx.setLineDash([2, 4], 1);
	// ctx.beginPath();
	// ctx.moveTo(12, 264);
	// ctx.lineTo(440, 264);
	// ctx.setStrokeStyle('#ffffff')
	// ctx.stroke();
	//绘制底部按钮
	// let x = 126,
	// 	y = 286,
	// 	w = 194,
	// 	h = 56,
	// 	r = 30;
	// if (w < 2 * r) r = w / 2;
	// if (h < 2 * r) r = h / 2;
	// ctx.beginPath();
	// ctx.moveTo(x + r, y);
	// ctx.arcTo(x + w, y, x + w, y + h, r);
	// ctx.arcTo(x + w, y + h, x, y + h, r);
	// ctx.arcTo(x, y + h, x, y, r);
	// ctx.arcTo(x, y, x + w, y, r);
	// ctx.closePath();
	// //按钮渐变色
	// const grd = ctx.createLinearGradient(x, y, x + w, y)
	// grd.addColorStop(0, '#FFFFFF')
	// grd.addColorStop(1, '#F0ECFF')
	// ctx.setFillStyle(grd)
	// ctx.fill()

	// //绘制按钮文字
	// ctx.setFillStyle('#7657ef'); // 文字颜色
	// ctx.setFontSize(22); // 文字字号
	// ctx.fillText('浏览个人资料', 158, 324); // 绘制文字
	ctx.draw();

}


/**
 * @param {Object} canVasComtext
 * 绘制名片
 */
export async function drawCallingCard(canVasComtext, info) {
	// 背景
	const bg = await covertImage(bgUrl);
	canVasComtext.drawImage(bg, 0, 0, 360, 288);

	// 头像
	const avatar = await covertImage(info.noBackdropAvatar ?? info.avatar);
	canVasComtext.drawImage(avatar, 40, 40, 100, 150);

	// 绘制标签
	canVasComtext.setFontSize(10);
	canVasComtext.setFillStyle('#fff');
	canVasComtext.fillText(info.slogan, 210, 80);

	// 绘制电话
	canVasComtext.setFontSize(10);
	canVasComtext.setFillStyle('#fff');
	canVasComtext.fillText('电话：' + info.phone, 150, 120);

	// 绘制邮箱
	canVasComtext.setFontSize(10);
	canVasComtext.setFillStyle('#fff');
	canVasComtext.fillText('邮箱：' + info.email, 150, 140);

	// 绘制地址
	canVasComtext.setFontSize(10);
	canVasComtext.setFillStyle('#fff');
	canVasComtext.fillText('地址：', 150, 160);

	// 绘制地址
	canVasComtext.setFontSize(10);
	canVasComtext.setFillStyle('#fff');
	drawArticle(canVasComtext, info.companyDetailAddress, 140, 180, 160);
	// canVasComtext.fillText( info.companyDetailAddress, 170, 160);


	// 绘制姓名
	canVasComtext.setFontSize(16);
	canVasComtext.setFillStyle('#fff');
	// canVasComtext.font = 'normal bold 18px Arial,sans-serif';
	canVasComtext.fillText(info.name, 150, 80);

	canVasComtext.draw();
}



// 绘制圆角矩形
function drawRoundedRect(ctx, x, y, width, height, radius) {
	ctx.moveTo(x + radius, y)
	ctx.lineTo(x + width - radius, y)
	ctx.arc(x + width - radius, y + radius, radius, 1.5 * Math.PI, 2 * Math.PI)
	ctx.lineTo(x + width, y + height - radius)
	ctx.arc(x + width - radius, y + height - radius, radius, 0, 0.5 * Math.PI)
	ctx.lineTo(x + radius, y + height)
	ctx.arc(x + radius, y + height - radius, radius, 0.5 * Math.PI, 1 * Math.PI)
	ctx.lineTo(x, y + radius)
	ctx.arc(x + radius, y + radius, radius, 1 * Math.PI, 1.5 * Math.PI)
}

// 绘制文字自动换行
function drawArticle(ctx, kl, width, x, y) {
	let chr = kl.split('') // 分割为字符串数组
	let temp = ''
	let row = []
	for (let a = 0; a < chr.length; a++) {
		if (ctx.measureText(temp).width < width) {
			temp += chr[a]
		} else {
			a--
			row.push(temp)
			temp = ''
		}
	}
	row.push(temp)

	for (var b = 0; b < row.length; b++) {
		// 控制最多显示2行
		if (b < 2) {
			ctx.fillText(row[b], x, y + b * 20);
		}
	}
	let _len = row.length > 2 ? 2 : row.length
	return y + (_len - 1) * 20
}